import React from 'react'
import styles from "./index.module.css"
const titleList = [
    { title: '区域', type: 'area' },
    { title: '方式', type: 'mode' },
    { title: '租金', type: 'price' },
    { title: '筛选', type: 'more' },
]
export default function FilterTitle({ titleSelectedStatus, onClick }) {

    return (

        <div className={styles.filtertitle} >
            {titleList.map(item => {
                const isSelectd = titleSelectedStatus[item.type]
                return <div key={item.type} className={styles.filtertitle_item} onClick={() => onClick(item.type)}>
                    <span className={isSelectd ? styles.active_focus : ''}>
                        <span>{item.title}</span>
                        <i className='iconfont icon-arrow-down-filling'></i>
                    </span>
                </div>
            })
            }
        </div>
    )
}
